import * as React from 'react';
import {View, Text, Image} from 'react-native';
import WebView from 'react-native-webview';
import ImageConstants from '../resources/ImageConstants';
import AutoSizingImage from '../components/AutoSizingImage';

class CabnetNewsDetailPage extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  render() {
    let param = this.props.route.params.html;
    const html = `<div style="font-size: 30px !important;">${param}</div>`;
    return (
      <View style={{flex: 1, alignItems: 'stretch'}}>
        <AutoSizingImage
          width={'100%'}
          source={ImageConstants.ICON_MANAGE_BCG}
          style={{position: 'absolute', top: 0, left: 0}}
        />
        <Text
          style={{
            fontSize: 30,
            marginHorizontal: 15,
            marginTop: 75,
            marginBottom: 15,
            color: 'white',
            textAlign: 'center',
          }}>
          {this.props.route.params.title}
        </Text>
        <AutoSizingImage
          width={'90%'}
          style={{marginLeft: '5%'}}
          source={{uri: this.props.route.params.img}}
        />
        <WebView
          useWebkit
          androidHardwareAccelerationDisabled={true}
          originWhitelist={['*']}
          style={{flex: 1, padding: 10}}
          javaScriptEnabled={true}
          source={{html: html, baseUrl: ''}}
          ref={v => (this.webView = v)}
        />
      </View>
    );
  }
}

export default CabnetNewsDetailPage;
